.project-card-view {
  .project-cards-container {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 16px;
    margin-bottom: 16px;
  }

  .project-card-wrapper {
    display: flex;
    flex-direction: column;
  }

  .project-card {
    margin-bottom: 16px;
    transition: box-shadow 0.3s ease, transform 0.3s ease;

    &:hover {
      box-shadow: var(--box-shadow-base);
      transform: translateY(-2px);
    }

    .card-title {
      display: flex;
      align-items: center;
      overflow: hidden;

      .project-icon {
        font-size: 18px;
        margin-right: 8px;
        flex-shrink: 0;
      }

      .project-name {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
      }
    }

    .card-content {
      .info-item {
        margin-bottom: 12px;

        &:last-child {
          margin-bottom: 0;
        }

        .ant-typography {
          display: block;
        }

        .path {
          color: var(--color-text-secondary);
          margin-top: 4px;
        }
      }
    }
  }
}
